import { Form, Input, Modal } from "antd";
import { useState } from "react";
import { getSftpApi, getToken } from "../utils/client";

export interface MkdirModalProps {
    curClientId: string
    curPath: string
    onOk: () => void;
    onCancel: () => void;
}

function MkdirModal(props: MkdirModalProps) {
    const [name, setName] = useState("");

    const createDir = async () => {
        const api = getSftpApi();
        await api.sftpMkDirPost({
            sftpMkDirPostRequest: {
                token: getToken(),
                id: props.curClientId,
                path: props.curPath,
                name,
            },
        });
        props.onOk()
    };
    return (
        <Modal open title="创建目录" okText="创建" okButtonProps={{ disabled: name == "" || name.includes("/") || name.includes("\\") }}
            onCancel={e => {
                e.stopPropagation();
                e.preventDefault();
                props.onCancel();
            }}
            onOk={e => {
                e.stopPropagation();
                e.preventDefault();
                createDir();
            }}>
            <Form>
                <Form.Item label="目录名称" help={
                    <>
                        {(name.includes("/") || name.includes("\\")) && (
                            <span style={{ color: "red" }}>不能包含/或\等特殊字符</span>
                        )}
                    </>
                }>
                    <Input value={name} onChange={e => {
                        e.stopPropagation();
                        e.preventDefault();
                        setName(e.target.value.trim());
                    }} />
                </Form.Item>
            </Form>

        </Modal>
    );
}

export default MkdirModal;